<template>
  <div>
    <!-- 上拉加载更多，下拉刷新待写 -->
    <div class="list_box">
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="getList" :offset="10">
        <div v-for="(item,index) in list" :key="index" class="list">{{item.title}}</div>
      </van-list>
    </div>
    <Footer />
  </div>
</template>

<script>
// window.screen.lockOrientation(["portrait-primary","portrait-secondary"])   js强制竖屏，貌似不起作用
import { List, Cell } from "vant";
import axios from 'axios'
export default {
  name: "home",
  components: {
    [List.name]: List,
    [Cell.name]: Cell
  },
  data() {
    return {
      list: [],
      loading: false,
      finished: false,
      page: 1,
      setTimeData:0
    };
  },
  methods: {
    getList() {
      setTimeout(() => {
        let url ='http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page='+this.page
        axios.get(url).then((res)=> {
          this.list = this.list.concat(res.data.result);
          ++this.page
          // let today = new Date().getTime()
          // console.log(today)
          this.finished = false
          this.loading = false
          if(res.data.result.length < 20 && this.page != 1){
            console.log('<20')
            this.finished = true; 
          } 
        })
      },this.setTimeData)
    }
  }
};
</script>
<style lang="scss" scoped>
.list_box{
  margin-bottom: 100px;
}
.list{
  margin:10px;
}
</style>
